var toast = function() {
  var _self = this;
  this.append = function(parent, html, id) {
    var txtNode = document.createElement("div");
    txtNode.id = id;
    txtNode.innerHTML = html;
    parent.appendChild(txtNode);
  };
  this.hide = function(id, callback) {
    document.getElementById('toast-body' + id).style = "transform: scale3d(0,0,1)";
    document.getElementById('bw-toast' + id).style = "opacity: 0";
    setTimeout(function() {
      let node = document.getElementById(id);
      node.parentNode.removeChild(node);
      if (callback) callback();
    }, 500);
  }
  this.showConfirm = function(obj) {
    var config = {
      cancelWords: obj.cancelWords ? obj.cancelWords : '取消',
      sureWords: obj.sureWords ? obj.sureWords : '确认'
    }
    var idNum = new Date().getTime() + '-' + Math.ceil(Math.random() * 1000);
    var html = '<div class="bw-toast" class="bw-toast' + idNum + '"><div class="toast-body toast-confirm" id="toast-body' + idNum + '"><div class="toast-content ng-binding">' + obj.text + '</div><div><span class="toast-btn toast-cancel" id="toast-cancel' + idNum + '">' + config.cancelWords + '</span><span class="toast-btn toast-sure" id="toast-sure' + idNum + '">' + config.sureWords + '</span></div></div></div>';
    _self.append(document.getElementsByTagName("body")[0], html, idNum);

    document.getElementById('toast-cancel' + idNum).onclick = function() {
      _self.hide(idNum, obj.cancelFn());
    }
    document.getElementById('toast-sure' + idNum).onclick = function() {
      _self.hide(idNum, obj.sureFn());
    }
  };
  this.showTips = function(text, callback) {
    var idNum = new Date().getTime() + '-' + Math.ceil(Math.random() * 1000);
    var html = '<div class="bw-toast" id="bw-toast' + idNum + '"><div class="toast-body toast-tips" id="toast-body' + idNum + '"><div class="toast-content ng-binding">' + text + '</div><div><span class="toast-btn toast-sure" id="toast-sure' + idNum + '">确认</span></div></div></div>';
    _self.append(document.getElementsByTagName("body")[0], html, idNum);
    document.getElementById('toast-sure' + idNum).onclick = function() {
      _self.hide(idNum, callback);
    }
  };
  this.showToast = function(text, time, callback) {
    if (!time) time = 1500;
    time = parseInt(time);
    var idNum = new Date().getTime() + '-' + Math.ceil(Math.random() * 1000);
    var html = '<div class="bw-toast" id="bw-toast' + idNum + '"><div class="toast-body toast-box" id="toast-body' + idNum + '"><div class="toast-content ng-binding">' + text + '</div></div></div>';
    _self.append(document.getElementsByTagName("body")[0], html, idNum);

    var animation = setTimeout(function() {
      _self.hide(idNum);
    }, time);
    document.getElementById('bw-toast' + idNum).onclick = function() {
      _self.hide(idNum);
      clearTimeout(animation);
    }
  };
  this.showLoading = function() {
    var idNum = new Date().getTime() + '-' + Math.ceil(Math.random() * 1000);
    var html = '<div class="bw-toast" id="bw-toast' + idNum + '"><div class="toast-body toast-loading"><div class="toast-content ng-binding"><img src="../../static/img/load.gif" alt=""/></div></div></div>';
    _self.append(document.getElementsByTagName("body")[0], html, idNum);
    return idNum;
  };
  this.hideLoading = function(id) {
    let node = document.getElementById(id);
    node.parentNode.removeChild(node);
  }
};
export default new toast
